<script lang="ts" setup>
import { useAuthStore } from '@/store/auth';
import { useLocale } from '@/locale/locale';

const { t } = useLocale();
const authStore = useAuthStore();

function handleInputChange(e: AnyObject) {
  authStore.setEmail(e.detail.value);
}
</script>

<template>
  <view class="mb-5 input-phone-number">
    <view class="flex items-center">
      <input :placeholder="t('LUKey_inputEmailAddress')" @input="handleInputChange" />
    </view>
  </view>
</template>

<style lang="scss">
.input-phone-number {
  background: rgba(0, 0, 0, 0.04);
  border-radius: 214rpx;
  height: 100rpx;
  padding: 28rpx 48rpx;
  width: 630rpx;
}
</style>
